<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
     <% 
String path = request.getContextPath(); 
// 获得项目完全路径（假设你的项目叫MyApp，那么获得到的地址就是 http://localhost:8080/MyApp/）: 
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 
%> 
<!DOCTYPE html>
<html>
<head>
<base href=" <%=basePath%>"> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" content="用户个人信息">
<meta name="author" content="xwj">
<title>个人信息</title>
<!-- <link rel="stylesheet" href="css/user_css/css/bootstrap.min.css" /> -->
<link href="bootstrap/bootstrap.css" rel="stylesheet">
        <link rel="stylesheet" href="css/user_css/css/font-awesome.min.css" />
        <!-- Custom CSS -->
        <link href="public_user/style.css" rel="stylesheet">
      <!-- 重置文件 -->
  <link rel="stylesheet" href="css/user_css/css/register/css/normalize.css">
  <link rel="stylesheet" href="css/user_css/css/register/css/style.css">  
  <!-- 表单验证 -->

  <script src="jquery/jquery-2.2.4.min.js"></script>
<script src="bootstrap/bootstrap.min.js"></script>
<script src="bootstrap/bootstrapvalidator/js/bootstrapValidator.min.js"></script>
  <script>
	$(function() {
		userInfo();
		 //表单验证
	    $("#user_form").bootstrapValidator({
	      message : 'This value is not valid',
	      feedbackIcons : {/*输入框不同状态，显示图片的样式*/
	        valid : 'glyphicon glyphicon-ok',
	        invalid : 'glyphicon glyphicon-remove',
	        validating : 'glyphicon glyphicon-refresh'
	      },
	      fields : {/*验证*/
	    	 urename : {/*键名username和input name值对应*/
	          message : 'The name is not valid',
	          validators : {
	            stringLength : {/*长度提示*/
	              min : 0,
	              max : 16,
	              message : '用户名的长度必须小于16位'
	            }
	          }
	        },
	        utel : {
	          message : 'The cdesc is not valid',
	          validators : {
	        	   notEmpty: {/*非空提示*/
	                     message: '电话不能为空'
	                 },
	                 regexp: {
	                 	regexp: /^1[34578]\d{9}$/,
	                 	message: '存在不符合的字符' 
	                 },
	                 stringLength: {/*长度提示*/
	                     min: 11,
	                     max: 11,
	                     message: '电话长度必须是11位'
	                 }
	          }
	        },
	        uaddress: {
	        	  message : 'The address is not valid',
                validators: {
                	 stringLength: {/*长度提示*/
	                     min:6,
	                     max: 30,
	                     message: '地址长度必须在6到30位之间'
	                 }
                }
            }, 
            uqq: {
                message: 'The qq is not valid',
                validators: {
                    regexp: {
                    	regexp: /^\d{6,12}$/,
                    	message: 'QQ必须是数字'
                    },
                    stringLength: {/*长度提示*/
                        min: 6,
                        max: 12,
                        message: 'QQ长度必须在6到12位之间'
                    }
                    
                }
            },
            uemail: {
                message: 'The email is not valid',
                validators: {
                    regexp: {
                    	regexp: /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
                    	message:  '存在不符合的字符' 
                    },
                    stringLength: {/*长度提示*/
                        min: 6,
                        max: 20,
                        message: '邮箱长度必须在6到20位之间'
                    }
                    
                }
            }
	      }
	    });
	});
	//获取用户信息
	function userInfo(){
		$.ajax({
			url : 'userMsg/userInfo.do',
			type : 'POST',
			async : "true",
			data : {},
			dataType : 'json',
			success : function(data) {
				if (data.res == 1) {
					$("input[name='ugrade']").val(data.membername);
					$.each(data.list,function(index, element) {
						$("input[name='uname']").val(element.uname);
						$("input[name='urename']").val(element.urelname);
						$("input[name='utel']").val(element.utel);
						$("input[name='uaddress']").val(element.uaddress);
						$("input[name='uqq']").val(element.uqq);
						$("input[name='uemail']").val(element.uemail);
						$("input[name='uint']").val(element.uintegral);
					});
				}
			}
		});
	}
	
	
	//修改用户信息
	function changeUserInfo() {
		var bv = $("#user_form").data('bootstrapValidator');
		bv.validate();
		if (!bv.isValid()) {
			return;
		}
		if (!confirm("确认要修改吗?")) {
			return;
		}
		var relname=$("input[name='urename']").val();
		var utel=$("input[name='utel']").val();
		var uaddress=$("input[name='uaddress']").val();
		var uqq=$("input[name='uqq']").val();
		var uemail=$("input[name='uemail']").val();
		$.ajax({
			url : 'userMsg/changeUserInfo.do',
			type : 'POST',
			async : "true",
			data : {
				"relname":relname,
				"utel":utel,
				"uaddress":uaddress,
				"uqq":uqq,
				"uemail":uemail
			},
			dataType : 'json',
			success : function(data) {
				if (data.res >0) {
					alert("修改成功");
					$("#user_form")[0].reset();
					userInfo();
				}else{
					alert("修改失败");
				}
			}
		});
		}
		</script>
  
  
</head>
<body >
<!--header start-->
     <%@include file="header.jsp"%>
      <!--header end-->
      <!-- heading-banner-start -->
       
        <!-- heading-banner-end -->
        
       <!-- main-start -->
       <div class="info_main">
       <div class="info_div">
   <div class="p_div"><p>个人信息</p></div>
<form class="form-horizontal" role="form" id="user_form">
 <div class="form-group">
              <label for="uname" class="col-sm-3 control-label">用户名</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="uname" id="uname"
                 readonly placeholder="用户名" />
              </div>
            </div>
     	<div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">真实姓名</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="urename" id=""
                   placeholder="请输入您的真实姓名" />
              </div>
            </div>
           <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">电话</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="utel" id="" maxlength="11" data-error="手机号码不能为空||手机号码格式不正确"
                   placeholder="请输入您的电话" />
              </div>
            </div>
    		 <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">地址</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="uaddress" id=""
                   placeholder="请输入您的地址" />
              </div>
            </div>
            	 <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">QQ</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="uqq" id=""
                   placeholder="请输入您的QQ" />
              </div>
            </div>
               <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">邮箱</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="uemail" id=""
                   placeholder="请输入您的邮箱" />
              </div>
            </div>
                <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">积分</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="uint" id=""
                 readonly  placeholder="积分" />
              </div>
            </div>
            <div class="form-group">
              <label for="firstname" class="col-sm-3 control-label">会员等级</label>
              <div class="col-sm-8">
                <input type="text" class="form-control" name="ugrade" id=""
                  readonly placeholder="会员等级" />
              </div>
            </div>
        <button class="my_btn" onClick="changeUserInfo()">确认</button>
     
    </form>
  </div>
  </div>
        
         <!-- main-end -->
         <!--footer start-->
   <%@include file="footer.jsp"%>
   <!--footer end-->
     
        <!-- owl.carousel js -->
        <script src="css/user_css/js/owl.carousel.min.js"></script>
        <!-- meanmenu js -->
        <script src="css/user_css/js/jquery.meanmenu.js"></script>
        <!-- countdown js -->
        <script src="css/user_css/js/countdown.js"></script>
        <!-- jquery.nivo.slider.pack js -->
        <script src="css/user_css/js/jquery.nivo.slider.pack.js"></script>
        <!-- jquery-ui.min.js -->
        <script src="css/user_css/js/jquery-ui.min.js"></script>
        <!-- wow js -->
        <script src="css/user_css/js/wow.min.js"></script>
        <!-- plugins js -->
        <script src="css/user_css/js/plugins.js"></script>
        <!-- main js -->
        <script src="css/user_css/js/main.js"></script>

 <!--  <script type="text/javascript" src="css/user_css/css/register/js/script.js"></script> -->
        
</body>
</html>